<!-- 机构接收 -->
<template>
  <el-card>
    <el-row>
      <el-form ref="form" :model="searchDto" inline label-suffix=":">
        <el-form-item label="关键字" prop="keywords">
          <el-input
            v-model="searchDto.keywords"
            placeholder="请输入关键字"
            style="width: 250px"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="primary" @click="search"
            >查询</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-s-open" type="primary" @click="clear"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
    </el-row>
    <page-table
      ref="recovery"
      :page-data="pageData"
      :loading="loading"
      :do-get-page-data="getPageData"
    >
      <el-table-column type="index" label="编号" width="80" align="center" />
      <el-table-column prop="recoveryName" label="儿童姓名" align="center" />
      <el-table-column prop="applyUserName" label="申请人" align="center" />
      <el-table-column prop="applyType" label="申请方式" align="center" />
      <el-table-column
        prop="applyRecoveryInstitution"
        label="申请机构"
        align="center"
      />
      <el-table-column prop="guardianName" label="监护人姓名" align="center" />
      <el-table-column
        prop="guardianPhone"
        label="监护人手机号"
        align="center"
      />
      <!-- <el-table-column
        prop="recoveryTypeName"
        label="救助类型"
        align="center"
      /> -->
      <el-table-column prop="serveStartTime" label="启用时间" align="center" />
      <el-table-column prop="serveEndTime" label="结束时间" align="center" />
      <el-table-column prop="serveStatus" label="状态" align="center">
        <template slot-scope="scope">
          {{ scope.row.serveStatus | keyText("SERVE_STATUS") }}
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="300" fixed="right">
        <template slot-scope="scope">
          <el-button v-if="scope.row.serveStatus === 'SERVING'" type="text" @click="changeStatus(scope.row)">
            {{ btnStatus(scope.row)}}
          </el-button>
          <el-button v-if="scope.row.serveStatus === 'TO_SERVE'" type="text" @click="changeStatus(scope.row)">
            {{ btnStatus(scope.row)}}
          </el-button>
          <el-button v-if="scope.row.serveStatus === 'SERVED'" type="text">
            {{ btnStatus(scope.row)}}
          </el-button>
        </template>
      </el-table-column>
    </page-table>
  </el-card>
</template>
<script>
export default {
  name: "receive",
  data() {
    return {
      pageData: {},
      loading: false,
      show:true,
      status:'',
      institutionId:'',
      searchDto: {
        pageIndex: null,
        pageSize: null,
        keywords: null,
        startTime: null,
        endTime: null,
        institutionId: null,
      },
      switchValue: true,
    };
  },
  methods: {
    // 机构信息
    getInfo() {
      this.API.deleteRecoveryInstitutionById().then((res) => {
        this.searchDto.institutionId = res.data.id;
        this.getPageData();
      });
    },
    // 获取分页数据
    getPageData(val) {
      let tem = Object.assign(this.searchDto, val);
      this.API.getRecoveryReceivePageList(tem).then((ret) => {
        this.pageData = ret.data;
        console.log("分页：", ret.data);
      });
    },

    // 查询
    search() {
      this.getPageData({ pageIndex: 1 });
    },
    //清空
    clear() {
      this.$refs.form.resetFields();
      this.getPageData();
    },
    // 开关
    changeStatus(row) {
      let serverStatus="";//变更的状态
      let msgTip = ""
      // 机构服务状态 to-serve未服务、serving-服务中、served-服务结束
      if(row.serveStatus == 'SERVING'){
        msgTip="确认要关闭服务吗？"
        serverStatus = 'SERVED'
      }else if(row.serveStatus =='TO_SERVE'){
        msgTip = '确认要启用服务吗？'
        serverStatus = 'SERVING'
      }else{
        return 
        //结束状态 不做操作
      }
      this.$confirm(msgTip, "提示", { type: "warning" }).then(() => {
        // 更新状态
        this.API.updateRecoveryReceiveServeStatus({ id:row.id, institutionId:this.searchDto.institutionId,serverStatus:serverStatus}).then(
          (ret) => {
            this.getPageData();
          }
        );
      });
    },
    btnStatus(serverStatus){
      const status = serverStatus.serveStatus;
      return status==="TO_SERVE"?"启用":(status==="SERVING"?'关闭':"结束")

    }
  },
  mounted() {
    this.getInfo();
  },
};
</script>
<style scoped lang="scss"></style>